<!--  -->
<template>
  <div class="container">
    <div @click="toDetail(item.dd_id)" class="content" v-for="(item,index) of list" :key="index">
      <div class="time">
        <div class="font_18">{{item.create_time}}</div>
        <div class="col_org" v-if="item.tr_status == 1">待审核</div>
        <div class="col_gre" v-if="item.tr_status == 2 && item.write_off_status == 0">审核通过</div>
        <div class="col_ff5" v-if="item.tr_status == 3">审核驳回</div>
        <div class="col_b0b" v-if="item.write_off_status == 1 && item.tr_status == 2">已核销</div>
      </div>
      <div class="item">
        <div class="wid_60">医院</div>
        <div class="font_400">{{item.hospital_name}}</div>
      </div>
      <div class="item">
        <div class="wid_60">项目</div>
        <div class="font_400">{{item.dd_project_name}}</div>
      </div>
      <div class="item">
        <div class="wid_60">用户</div>
        <div class="font_400">{{item.username+'/'+item.user_pone}}</div>
      </div>
      <div class="item line">
        <div class="wid_60">推荐人</div>
        <div class="font_400">{{item.ref_name+'/'+item.ref_pone}}</div>
      </div>
      <div class="item mt_7 js_bett">
        <div class="df">
          <div class="wid_60">金额</div>
          <div class="font_400">￥{{item.project_price}}</div>
        </div>
        <div
          class="hx_btn"
          v-if="item.tr_status == 2 && item.write_off_status == 0"
          @click.stop="toHexiao(item.dd_id)"
        >核销</div>
        <!-- <div class="hx_btn" v-if="item.tr_status == 3" @click.stop="toEdit(item.dd_id)">修改</div> -->
      </div>
    </div>
    <div class="noneblock" v-if="!list || list.length == 0">
      <img src="https://mmkappnew.oss-cn-beijing.aliyuncs.com/authentication/gjnull.png" alt />
      <div>未查询到相关结果，请确认后再查询~</div>
    </div>
  </div>
</template>

<script>
import api from "../../assets/js/api";
import { Toast } from "mint-ui";
export default {
  data() {
    return {
      list: [],
    };
  },

  components: {},


  mounted() {
    document.title = "查询结果";
    this.axios.defaults.baseURL = api;
    // console.log('query',this.$route.query)
    this.getList()
    // this.list = JSON.parse(sessionStorage.getItem('search_result_list'));
  },

  methods: {
    getList(){
           this.axios
          .post("api/butler/declaration/searchDeclaration",  this.$route.query)
          .then(res => {
            res = res.data;
            if(res.code == 200){
              console.log(res.data.data);
              this.list = res.data.data
              // this.$router.push("/searchResult");
              // sessionStorage.setItem('search_result_list', JSON.stringify(res.data.data))
            }else{
                  Toast({
                  message: res.data.msg,
                  position: "bottom",
                  duration: 2000
                });
            }
          });
    },
    // 核销
    toHexiao(dd_id) {
      this.$router.push({path:'/formHexiao',query:{dd_id}})
    },
    toDetail(dd_id) {
      this.$router.push({path:'/createForm',query:{dd_id,pageType:"detail"}})
      console.log("toDetail");
    },
    toEdit(dd_id) {
      this.$router.push({path:'/createForm',query:{dd_id,pageType:"edit"}})
    },
  }
}

</script>
<style  scoped>
.container {
  width: 100%;
  min-height: 100vh;
  background: #f5f6f7;
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
}
.content {
  width: 351px;
  height: 235px;
  background: #ffffff;
  box-shadow: 0px 8px 14px 0px rgba(14, 26, 128, 0.03);
  border-radius: 8px;
  padding: 14px 12px;
  margin: 12px auto;
  font-size: 15px;
  color: #3f454b;
  font-weight: 500;
  box-sizing: border-box;
}
.time {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 16px;
  box-sizing: border-box;
}
.font_18 {
  font-size: 18px;
  color: #1d2023;
}
.item {
  display: flex;
  align-items: center;
  margin-bottom: 9px;
}
.wid_60 {
  width: 66px;
}
.font_400 {
  font-weight: 400;
}
.line {
  border-bottom: 1px solid #eaeaea;
  padding-bottom: 14px;
  box-sizing: border-box;
}
.mt_7 {
  margin-bottom: 0 !important;
}
.col_org {
  color: #fe9d20;
}
.col_gre {
  color: #4dd23b;
}
.col_ff5 {
  color: #ff5e5e;
}
.col_b0b {
  color: #b0b9c3;
}
.df {
  display: flex;
  align-items: center;
}
.js_bett {
  justify-content: space-between;
}
.hx_btn {
  width: 76px;
  height: 31px;
  line-height: 31px;
  text-align: center;
  color: #fff;
  font-size: 13px;
  background: linear-gradient(180deg, #ffdddd 0%, #ff83a6 100%);
  border-radius: 4px;
  box-sizing: border-box;
}
.noneblock {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  font-family: PingFangSC-Regular, PingFang SC;
  font-weight: 400;
  color: rgba(120, 130, 140, 1);
  line-height: 20px;
}
.noneblock img {
  width: 272px;
  height: 176px;
  margin: 180px 0 20px 0;
}
</style>